<template>
	<div class="app-container" v-loading="loading">
		<div class="search-container  app_ny">
			<div class="div2" style="position: relative">
				<el-row :gutter="12" style="width: 100%">
					<el-col :span="3">
						<el-input v-model="queryParams.invoice_no" clearable placeholder="请输入发票号码" 
							@keyup.enter="handleQuery" />
					</el-col>
					<el-col :span="3">
						<el-input v-model="queryParams.company" clearable placeholder="请输入开票单位" 
							@keyup.enter="handleQuery" />
					</el-col>
					<el-col :span="3">
						<el-select
						     v-model="queryParams.status"
						     placeholder="请选择审核状态"
							 clearable>
						     <el-option label="待审核" value="0"/>
							 <el-option label="已通过" value="1"/>
							 <el-option label="已驳回" value="2"/>
						   </el-select>
					</el-col>
					<el-col :span="6" >
						<el-button  :loading="loading"  type="primary" @click="handleQuery"><template
							#icon><i-ep-search /></template>查询</el-button>
					</el-col>
				</el-row>
				<FilterColumn
				 class="filtBox"
				 @handleRefresh="resetQuery()"
				:strtype="strtype"></FilterColumn>
			</div>	
		</div>
		
		<el-card shadow="never">
			<div class="action-row">
				<el-button v-hasPerm="['engineering.Invoice/save']" type="primary" @click="handleDo('','act_add')" plain><template #icon><i-ep-plus /></template>新增</el-button>
				<el-button  @click="handleDo('', 'act_info')" :disabled="multipleSelection.length !== 1" :type="buttonType(multipleSelection.length)" plain><template #icon><i-ep-document/></template>详情</el-button>
				<el-button v-hasPerm="['engineering.Invoice/update']"  @click="handleDo('', 'act_edit')" :disabled="multipleSelection.length !== 1" :type="buttonType(multipleSelection.length)" plain><template #icon><i-ep-edit/></template>修改</el-button>
				<el-button v-hasPerm="['engineering.Invoice/delete']" @click="handleDo('', 'act_del')" :disabled="multipleSelection.length !== 1" :type="buttonType(multipleSelection.length)" plain><template #icon><i-ep-delete/></template>删除</el-button>
			</div>
		
			<el-table ref="dataTableRef" 
				v-loading="loading" 
				:data="tableData" 
				align="left" 
				tooltip-effect="dark"
				:show-overflow-tooltip="true" 
				:scrollbar-always-on="true"
				 border
				@cell-mouse-enter="rowMouse" 
				@cell-mouse-leave="menuLineVisible=false"
				@selection-change="handleSelectionChange">
				<el-table-column type="selection" align="center" width="55" />
				<el-table-column type="index" label="序号" align="center" width="80" />
				<template v-for="(item,index) in cColumnsList()" :key='index'>
					<el-table-column :label="item.label"
									 :align="item.align" 
									 :prop="item.prop"
									 :width="item.width"
									 :min-width="item.minwidth">
						<template #default="scope" v-if="item.prop == 'invoice_type'">
							<span v-if="scope.row.invoice_type == 1">专票</span>
							<span v-if="scope.row.invoice_type == 2">普票</span>
						</template>
						<template #default="scope" v-if="item.prop == 'status'">
							<el-tag v-if="scope.row.status == 0" type="info">待审核</el-tag>
							<el-tag v-if="scope.row.status == 1" type="success">已通过</el-tag>
							<el-tag v-if="scope.row.status == 2" type="danger">已驳回</el-tag>
						</template>
					</el-table-column>
				</template>
				
			</el-table>
			<pagination v-if="total > 0" v-model:total="total" v-model:page="queryParams.page"
				v-model:limit="queryParams.limit" @pagination="handleQuery" />
		</el-card>

		<!--表单-->
		<el-dialog :title="formText" v-model="dialogVisible" lock-scroll 
			width="1000px"
			:close-on-click-modal="false" 
			:close-on-press-escape="false" class="list-info">
			<div v-if="['act_add','act_edit'].includes(dialogStatus)">
				<el-form ref="dataFormRef" :model="formTemp" :rules="formRules" label-position="right"
					label-width="190px">
					<el-form-item label="所属部门：" prop="did">
						<el-tree-select v-model="formTemp.did" 
							:data="baseConfigStore.newExDepartmentList" 
							:render-after-expand="false"
							check-strictly 
							node-key="id"
							:default-expanded-keys="[1]"
							style="width: 100%" 
							placeholder="请选择所属部门" 
							@node-click="nodeClick"
							:props="{
								label: 'name',
								children: 'children',
								value: 'id'}" >
								<template v-slot:default="{ node,data }">
									<treeBlock :nodeItem="node" :dataItem="data" :typeClass="0"></treeBlock>
								</template>
							</el-tree-select>
					</el-form-item>
					<el-form-item label="部门领导/子公司法人" prop="leader_uid">
						<el-tree-select v-model="formTemp.leader_uid"
							:data="options" 
							:render-after-expand="false"
							check-strictly 
							node-key="id"
							:default-expanded-keys="[1]"
							style="width: 100%" 
							placeholder="部门领导/子公司法人" 
							:props="{label: 'name',children: 'children',value: 'id'}" >
								<template v-slot:default="{ node,data }">
									<treeBlock :nodeItem="node" :dataItem="data" :typeClass="4"></treeBlock>
								</template>
							</el-tree-select>
					</el-form-item>
					<el-form-item label="开票单位：" prop="company">
						<el-input v-model="formTemp.company" placeholder="请输入开票单位" type="text" maxlength="30" />
					</el-form-item>
					<el-form-item label="摘要：" prop="abstract">
						<el-input v-model="formTemp.abstract" placeholder="请输入摘要" type="text" maxlength="30" />
					</el-form-item>
					<el-form-item label="发票号码：" prop="invoice_no">
						<el-input v-model="formTemp.invoice_no" placeholder="请输入发票号码" type="text" maxlength="30" />
					</el-form-item>
					
					<el-form-item label="发票种类 ：" prop="invoice_type">
						<el-select
						     v-model="formTemp.invoice_type"
						     placeholder="请选择发票种类"
						     class="defalut-width">
						     <el-option label="专票" :value="1"/>
							 <el-option label="普票" :value="2"/>
						   </el-select>
					</el-form-item>
					<el-form-item label="附件张数：" prop="annex">
						<el-input v-model="formTemp.annex" placeholder="请输入附件张数" type="text" maxlength="30" />
					</el-form-item>
					<el-form-item label="金额：" prop="amount">
						<el-input v-model="formTemp.amount" placeholder="请输入金额" type="text" maxlength="30" />
					</el-form-item>
					<el-form-item label="审批流程：" prop="rule">
						<div class="elTimeBox">
								<el-button 
									v-if="approveList.type == 0"
									type="primary" 
									style="margin-bottom: 20px;"
									@click="clickShenPiR('ac_addlist','rule')"><template #icon><i-ep-CirclePlusFilled /></template>增加一级审批</el-button>
								<el-timeline>
									<el-timeline-item v-for="(item,index) in formTemp.rule">
										<template #dot>
											<div class="el-timeline-item__node el-timeline-item__node--large">
												<el-icon><i-ep-user-filled /></el-icon>
											</div>
										</template>
										<div class="levelC">
											<div class="levelT">
												<h2 class="levelTH2" v-if="approveList.type == 0">第{{index + 1}}级审核人审批</h2>
												<h2 class="levelTH2" v-else>{{item.name}}</h2>

												<el-button v-if="index != 0" @click="delectUserClose(index,'rule')" circle style="border: none;" >
													<template #icon><i-ep-Delete /></template>
												</el-button>
											</div>
											<div class="levelP">
												<div v-for="(ites,inds) in item.user_info" class="levelPi">
													<div class="levelPiU">
														<div class="levelPiUImgs">
															<img class="levelPiUImg" :src="ites.avatar" alt="">
														</div>
														<div class="levelPiUName">
															{{ites.name}}
														</div>
													</div>
													<div class="levelDelet" @click="closeUser(item,index,inds,'rule')">
														<i-ep-CircleClose style="width: 14px;" />
													</div>
												</div>
												<div class="levelP_add" >
													<el-button @click="addUser(item,index,'rule')" >
														<template #icon><i-ep-CirclePlus /></template>添加
													</el-button>
												</div>
												
											</div>
										</div>
									</el-timeline-item>
								</el-timeline>
							</div>
					</el-form-item>
				</el-form>
			</div>
			<div v-if="dialogStatus === 'act_info'">
				<el-descriptions size="default" :column="1" border>
					
					
					<el-descriptions-item label-class-name="labelC1"
						label="所属部门：">{{formTemp.company_info?.name}}</el-descriptions-item>
					<el-descriptions-item label-class-name="labelC1"
						label="部门领导/子公司法人：">{{formTemp.leader_user?.name}}</el-descriptions-item>
					<el-descriptions-item label-class-name="labelC1"
						label="开票单位：">{{formTemp.company}}</el-descriptions-item>
					<el-descriptions-item label-class-name="labelC1"
						label="摘要：">{{formTemp.abstract}}</el-descriptions-item>
					<el-descriptions-item label-class-name="labelC1"
						label="发票号码：">{{formTemp.invoice_no}}</el-descriptions-item>
					<el-descriptions-item label-class-name="labelC1"
						label="发票种类：">
						<span v-if="formTemp.invoice_type == 1">专票</span>
						<span v-if="formTemp.invoice_type == 2">普票</span>
					</el-descriptions-item>
					<el-descriptions-item label-class-name="labelC1"
						label="附件张数：">{{formTemp.annex}}</el-descriptions-item>
					<el-descriptions-item label-class-name="labelC1"
						label="金额：">{{formTemp.amount}}</el-descriptions-item>
					<el-descriptions-item label-class-name="labelC1"
						label="添加人：">{{formTemp.user?.name}}</el-descriptions-item>
					<el-descriptions-item label-class-name="labelC1"
						label="添加时间：">{{formTemp.add_time_text}}</el-descriptions-item>
					<el-descriptions-item label-class-name="labelC1"
							label="审核状态：">
						<el-tag v-if="formTemp.status == 0" type="info">待审核</el-tag>
						<el-tag v-if="formTemp.status == 1" type="success">已通过</el-tag>
						<el-tag v-if="formTemp.status == 2" type="danger">已驳回</el-tag>
						<el-tag style="margin-left: 5px;" v-if="formTemp.status == 2 ||formTemp.status == 1 " >{{dataInfo.approve?.check_time_text}}</el-tag>
					</el-descriptions-item>
					
					
				
				</el-descriptions>
				
				<template v-if="dataInfo.approve?.rule?.length>0">
					<el-divider content-position="left">审批日志</el-divider>
					<el-row>
						<div class="uTCont" v-for="uItem in dataInfo.approve?.rule" style="width: 100%;">
							<h4 class="uThead">{{uItem.name}}</h4>
							<el-table border  :data="uItem.user_info" style="width: 100%">
							<el-table-column label="审批人" width="200">
								<template #default="scope">
									<div class="uhead">
										<el-avatar :size="40" :src="scope.row.avatar" ></el-avatar>
										<span class="uheadN">{{scope.row.name}}</span>
									</div>
								</template>
							</el-table-column>
							<el-table-column label="审核状态" align="center" width="150">
								<template #default="scope">
									<el-tag v-if="scope.row.status == 0" type="info">待审核</el-tag>
									<el-tag v-if="scope.row.status == 1" type="success">已通过</el-tag>
									<el-tag v-if="scope.row.status == 2" type="danger">已驳回</el-tag>
								</template>
							</el-table-column>
							<el-table-column label="操作日期" width="220">
								<template #default="scope">
									<el-icon> <el-icon-timer></el-icon-timer></el-icon>
									<span style="margin-left: 10px">{{ scope.row.check_time }}</span>
								</template>
							</el-table-column>
							<el-table-column label="备注">
								<template #default="scope">
									{{ scope.row.mark }}
								</template>
							</el-table-column>
						</el-table> 
						</div>
					</el-row>
				</template>
			</div>
			<template #footer>
				<div class="dialog-footer">
					<el-button v-if="['act_add','act_edit'].includes(dialogStatus)" v-no-more-click type="primary"
						@click="doData(dialogStatus)">提 交</el-button>
					<el-button @click="dialogVisible = false">关闭</el-button>
				</div>
			</template>
		</el-dialog>
		
		
		<!-- 选择审批人信息 -->
		<el-dialog v-model="dialogTree.visible" class="elDiaLog" lock-scroll title="选择审核人" width="1000px"
			@close="closeDialogTree">
			<div style="min-height: 300px;">
				<el-tree ref="treeRef" node-key="id" :data="options" :default-expanded-keys="[1]"
					:check-on-click-node="true" :show-checkbox="true"
					:props="{'children': 'children','label':'name','value':'id','disabled':'disable'}">
					<template #default="{ node, data }">
						<div class="lineDiv">
							<div  v-if="data.type  !=1 && data.type  !=2" class="lineimgs">
								<img class="lineimg" style="width: 20px;height: 20px;" :src="data.avatar" alt="">
							</div>
							<div class="lineTx">
								{{ node.label }} <span v-if="data.type  !=1 && data.type  !=2">- {{data.position}}</span>
							</div>
						</div>
					</template>
				</el-tree>
			</div>
			<template #footer>
				<div class="dialog-footer">
					<el-button type="primary" @click="getAllkeys">确定</el-button>
					<el-button @click="closeDialogTree">取消</el-button>
				</div>
			</template>
		
		</el-dialog>
		
	</div>
</template>
<script setup lang="ts">
	import { useRoute } from 'vue-router';
	import _ from 'lodash-es'
	import { daysBetweenDates } from "@/utils/funcall"
	import { useBaseConfigStore } from "@/store/modules/baseConfig";
	import { useUserStore } from "@/store/modules/user";
	import { useTableFilterStore } from "@/store/modules/tableFilter";
	

	import {
		engineeringInvoiceAdd,
		engineeringInvoiceEdit,
		engineeringInvoiceList,
		engineeringInvoiceInfo,
		engineeringInvoiceDel,

	} from "@/api/engine"
	
	//接口地址
	import {
		getDepartmentAndUser
	} from "@/api/doc";
	//接口地址
	import {
		approveInitInfo
	} from "@/api/approve";
	
	
	// 表格数据
	const userStore = useUserStore();
	const TableFilter = useTableFilterStore();
	const baseConfigStore = useBaseConfigStore();
	const strtype = ref('engineeringInvoice'); //数据
	// 表格标题
	const cTitles = ["所属部门","部门领导/子公司法人", "开票单位","摘要",'发票号码',"发票种类","附件张数","金额(元)","添加时间",'审核状态'];
	// 显示字段
	const sTitles = ["所属部门","开票单位",'发票号码',"发票种类","金额(元)","添加人","添加时间",'审核状态' ];
	// 字段属性
	const cColumns = [
		{ label: "所属部门", prop: "company_info.name", align: "center", minwidth: 200 },
		{ label: "部门领导/子公司法人", prop: "leader_user.name", align: "center", minwidth: 200 },
		{ label: "开票单位", prop: "company", align: "center", minwidth: 200 },
		{ label: "摘要", prop: "abstract", align: "center", minwidth: 150 },
		{ label: "发票号码", prop: "invoice_no", align: "center", minwidth: 150 },
		{ label: "发票种类", prop: "invoice_type", align: "center", minwidth: 150 },
		{ label: "附件张数", prop: "annex", align: "center", minwidth: 150 },
		{ label: "金额(元)", prop: "amount", align: "center", minwidth: 150 },
		{ label: "添加人", prop: "user.name", align: "center", minwidth: 150 },
		{ label: "添加时间", prop: "add_time_text", align: "center", minwidth: 180 },
		{ label: "审核状态", prop: "status", align: "center", minwidth: 150 },
		
	]
	interface TableGlobalLocal {
		[key : string] : any; // 或者更具体的类型
	}
	// 列表渲染
	function cColumnsList() {
		const ColumnsList = (TableFilter.tableGlobalLocal as TableGlobalLocal)[strtype.value + '_checklist'];
		if (ColumnsList) {
			const columnMap : any = {}; // 创建一个对象来存储cColumns中label和对象的映射  
			// 预先建立label到对象的映射  
			for (const column of cColumns) {
				columnMap[column.label] = column;
			}
			const newList = [];
			for (const label of ColumnsList) {
				// 尝试从映射中获取对象  
				const foundColumn = columnMap[label];
				if (foundColumn) {
					// 如果找到了，则添加到newList中  
					newList.push(foundColumn);
				}
			}
			return newList;
		}
		else {
			return [];
		}
	};
	// 列表-数据列初始化
	function columnsInit() {
		const dropColStr : string = strtype.value + '_dropCol';
		const checklistStr : string = strtype.value + '_checklist';
		const drop_col : any = (TableFilter.tableGlobalLocalTemp as TableGlobalLocal)[dropColStr];
		const checklist = (TableFilter.tableGlobalLocalTemp as TableGlobalLocal)[checklistStr];
		if (!drop_col) {
			(TableFilter.tableGlobalLocal as TableGlobalLocal)[dropColStr] = JSON.parse(JSON.stringify(cTitles));
			(TableFilter.tableGlobalLocalTemp as TableGlobalLocal)[dropColStr] = JSON.parse(JSON.stringify(cTitles));
		}
		if (!checklist) {
			(TableFilter.tableGlobalLocal as TableGlobalLocal)[checklistStr] = JSON.parse(JSON.stringify(sTitles));
			(TableFilter.tableGlobalLocalTemp as TableGlobalLocal)[checklistStr] = JSON.parse(JSON.stringify(sTitles));
		}
	}
	
	// 表单模型
	const cForm = {
		id:undefined,//企业融资记录id
		did:"",//所属部门
		leader_uid:"",//部门领导/子公司法人id
		company:"",//开票单位
		abstract:"",//摘要
		invoice_no:"",//发票号码
		invoice_type:"",//发票种类 1专票 2普票
		annex:"",//附件张数
		amount:"",//金 额
		rule:[] //审批流
	}
	// 验证规则
	const cRules = {
		did: [{required: true,message: '请选择所属部门',trigger: 'change'}],
		leader_uid: [{required: true,message: '请选择部门领导/子公司法人',trigger: 'change'}],
		company: [{required: true,message: '请输入开票单位',trigger: 'blur'}],
		abstract: [{required: true,message: '请输入摘要',trigger: 'blur'}],
		invoice_no: [{required: true,message: '请输入开票单位',trigger: 'blur'}],
		invoice_type: [{required: true,message: '请选择发票种类',trigger: 'blur'}],
		annex: [{required: true,message: '请输入附件张数',trigger: 'blur'}],
		amount: [{required: true,message: '请输入金额',trigger: 'blur'}],
	}
	
	
	const downCid= ref<any>("");
	const dataInfo = ref<any>({});
	const dataFormRef = ref(ElForm);

	/*** 搜索窗-字段表 */
	const queryParams = reactive({
		page: 1,
		limit: 20,
		invoice_no:"",//发票号码
		company:"",//开票单位
		status:""
	
	});
	
	const dialogVisible = ref(false);//表格
	const loading = ref(true);
	const total = ref(0);
	const tableData = ref<any>();
	const multipleSelection =ref<any>([]);
	const menuLineVisible =ref(true);
	const rowR = ref<any>({});
	

	const dialogStatus = ref<string>(""); // 操作行为 formText
	const formText =ref<string>(""); // 操作窗口标题
	const formTemp = ref<any>(cForm);
	//验证规则
	const formRules = ref<any>(cRules);
	
	
	
	
	
	// 行菜单事件
	function rowMouse(row:any) {
		menuLineVisible.value = true
		rowR.value = row
	}
	// 数据多选事件
	function handleSelectionChange(val:any) {
		multipleSelection.value = val
	}
	// 操作按钮样式
	function buttonType(val:any) {
		if (val === 1) {
			return 'primary'
		} else {
			return 'info'
		}
	}
	
	// 操作
	 function handleDo(row:any, act:string) {
		dialogStatus.value = act
		switch (act) {
			case 'act_add':
				dialogVisible.value = true
				formText.value = '新建信息'
				formTemp.value = JSON.parse(JSON.stringify(cForm))
				formRules.value = Object.assign({}, cRules)
				
				formTemp.value.rule = JSON.parse(JSON.stringify(approveList.value.rule));
				
				
				console.log(dataFormRef)
				nextTick(()=>{
					setTimeout(()=>{dataFormRef.value.clearValidate();},100)
				})
				break
			case 'act_edit':
				dialogVisible.value = true
				formText.value = '修改信息';
				
				const uitem = JSON.parse(JSON.stringify(row || multipleSelection.value[0]));
				console.log(uitem)
				formTemp.value = uitem;
				formTemp.value.leader_uid = '1_'+uitem.leader_uid
				downCid.value = uitem.cid;
				engineeringInvoiceInfo({id:formTemp.value.id}).then((res) => {
					formTemp.value.rule = res.data.approve.rule
				}).finally(() => {})
				nextTick(()=>{
					setTimeout(()=>{dataFormRef.value.clearValidate();},0)
				})
				break
			case 'act_del':
				handleDelete(JSON.parse(JSON.stringify(row || multipleSelection.value[0])))
				break
			default:
				dialogVisible.value = true
				formText.value = '查看详情'
				formTemp.value = JSON.parse(JSON.stringify(row || multipleSelection.value[0]));
				downCid.value = formTemp.value.cid;
				engineeringInvoiceInfo({id:formTemp.value.id}).then((res) => {
					formTemp.value.rule = res.data.approve.rule
					dataInfo.value = res.data
				}).finally(() => {
					
				})
		}
	}
	// 提交数据
	function doData(act:string) {
		dataFormRef.value.validate((valid:any) => {
			if (valid) {
				const tempData = JSON.parse(JSON.stringify(formTemp.value))
				const rules = []
				for(var i = 0 ; i <formTemp.value.rule.length;i++)
				{
					const item = formTemp.value.rule[i]
					if(approveList.value.type==1)
					{
						rules.push({
							name:item.name,
							type:item.type,
							level:item.level,
							user:item.user_info.map(userObj => userObj.uid)
						})
					}
					else
					{
						rules.push({
							name:`第${i + 1}级审批人审批`,
							type:0,
							level:0,
							user:item.user_info.map(userObj => userObj.uid)
						})
					}
				}
				if(tempData.fz_uid)
				{
					tempData.fz_uid  = formTemp.value.fz_uid.split("_")[1]
				}
				if(tempData.leader_uid)
				{
					tempData.leader_uid  = formTemp.value.leader_uid.split("_")[1]
				}
				
				tempData.rule =rules;
				
	
				if (tempData.id === undefined) {
					engineeringInvoiceAdd(tempData).then((res) => {
						dialogVisible.value = false
						ElMessage({ message:'信息添加成功',type:'success'})
						getList()
						resetTemp()
					}).finally(() => {
						loading.value = false;
					})
				 } 
				 else {
					 engineeringInvoiceEdit(tempData.id, tempData).then((res) => {
						const index = tableData.value.findIndex(v => v.id === tempData.id)
						tableData.value.splice(index, 1, tempData)
						dialogVisible.value = false
					 	ElMessage({ message:'信息修改成功',type:'success'})
						getList()
						resetTemp()
					 }).finally(() => {
					 	loading.value = false;
					 })
				}
			}
		})
	}
	
	// 初始表单数据
	function resetTemp() {
		formTemp.value = JSON.parse(JSON.stringify(cForm));
		resetForm();
	}
	// 表单重置
	function resetForm() {
		dataFormRef.value.resetFields()
	}
	
	// 点击选中
	function nodeClick(a: any,b: any,c: any,d: any){
		downCid.value = a.cid;
	}
	
	
	
	
	// 删除表单内容
	function handleDelete(row:any) {
		const Ids =row.id;
		if (!Ids) {
			ElMessage.warning("请勾选删除项");
			return;
		}
		ElMessageBox.confirm("确认删除已选中的数据项?", "警告", {
			confirmButtonText: "确定",
			cancelButtonText: "取消",
			type: "warning",
		}).then(() => {
			loading.value = true;
			engineeringInvoiceDel({ id: Ids }).then(() => {
					ElMessage.success("删除成功");
					getList()
					resetTemp()
			}).finally(() => (loading.value = false));
		});
	}
	
	
	

	// 初始化搜索内容
	function handleQuery() {
		getList();
	}
	// 获取列表的数据
	function getList(type:string='') {
		loading.value = true
		if (type === 'search') {
			queryParams.page = 1
		}
		engineeringInvoiceList(queryParams).then((res) => {
			tableData.value = res.data.list
			total.value = res.data.count
		}).finally(() => {
			loading.value = false;
		})
	}
	

	// 重置搜索内容
	function resetQuery() {
		handleQuery();
	}
	
	// 获取options 配置项
	const options = ref();
	const approveList = ref<any>({type:0,rule:[[]]});
	function get_options() {
		getDepartmentAndUser().then((res) => {
			console.log(res.data)
			options.value = res.data
		}).finally(() => { })
		
		approveInitInfo({type:7}).then((res) => {
			console.log(res)
			if(res.data.status==1)
			{
				approveList.value.type = 1 
				approveList.value.rule =res.data.rule
			}
			else
			{
				approveList.value.type = 0
				approveList.value.rule =[{name: "",user_info:[]}]
			}	
		}).finally(() => { })
	
	}
	
	// 审批流相关的代码 start
	const dialogTree = reactive<DialogOption>({
		visible: false,
	});
	const defaultUserKey = ref({
		type: "",
		userkey: [],
		index: -1
	});
	const treeRef = ref();
	/**
	 * 添加审批人
	 */
	function clickShenPiR(type : string, el : any, index ?: any) {
		if (type == "ac_delect") {
			formTemp.value[el].splice(index, 1)
		}
		else if (type == "ac_addlist") {
			formTemp.value[el].push({name: "",user_info:[]})
		}
	}
	/**
	 * 打开弹窗添加审批流信息
	 */
	function addUser(e : any, index : number, type : string) {
		console.log(e)
		defaultUserKey.value.userkey = e.user_info.map((item : any) => '1_' + item.uid);
		defaultUserKey.value.type = type;
		defaultUserKey.value.index = index
		dialogTree.visible = true;
		nextTick(() => {
			treeRef.value!.setCheckedKeys(defaultUserKey.value.userkey, false)
		})
	}
	// 删除审批人-组
	function delectUserClose(index:any,type:any){
		const items = formTemp.value[type];
		if (items.length > 1) {
			items.splice(index, 1);
		}
	}
	/**
	 * 删除审批人
	 */
	function closeUser(e : any, index : number, inds : number, type : string) {
		
		formTemp.value[type][index]['user_info'].splice(inds, 1);
	}
	function getAllkeys() {
		formTemp.value[defaultUserKey.value.type][defaultUserKey.value.index]['user_info'] = treeRef.value!.getCheckedNodes(true);
		closeDialogTree();
	}
	/**
	* 关闭 树形图 弹窗
	*/
	function closeDialogTree() {
		dialogTree.visible = false;
	}
	// 审批流相关的代码 End
	
	
	onMounted(() => {
		handleQuery();
		columnsInit();
		get_options();
	});
</script>

<style lang="scss" scoped>

</style>